/*
 * Copyright (c) 2010-2021 Contributors to the Eclipse Foundation
 * 
 * See the NOTICE file(s) distributed with this work for additional
 * information regarding copyright ownership.
 * 
 * This program and the accompanying materials are made available under the
 * terms of the Eclipse Public License 2.0 which is available at
 * http://www.eclipse.org/legal/epl-2.0
 * 
 * SPDX-License-Identifier: EPL-2.0
 */

/* ColorPalette
 * 
 * Styling of the ColorPalette consists of the following:
 * 
 * 1. the whole color palette
 *		.dijitColorPalette - for outline, border, and background color of the whole color palette
 *		Note: outline does not work for IE
 *
 * 2. the color swatch 
 *		.dijitColorPalette .dijitPaletteImg
 *		transparent (but clickable) <img> node inside of each <td>, overlaying the color swatch.
 *		displays border around a color swatch
 *
 * 3. hovered swatch
 * 		.dijitColorPalette .dijitPaletteCell:hover .dijitPaletteImg
 *		the hovered state of the color swatch - adds border
 * 	
 * 4. active and selected swatch
 * 		.dijitColorPalette .dijitPaletteCell:active .dijitPaletteImg
 *		.dijitColorPalette .dijitPaletteCellSelected .dijitPaletteImg
 *		adds border for active or selected state
 */
.oneui  .dijitColorPalette {
  border: 4px solid #9a9a9a;
  background: #ffffff;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: 0 0 4px 1px rgba(0,0,0,.2);
  -moz-box-shadow: 0 0 4px 1px rgba(0,0,0,.2);
  box-shadow: 0 0 4px 1px rgba(0,0,0,.2);
}
.oneui .dijitColorPalette .dijitPaletteImg {
  /* transparent (but clickable) <img> node inside of each <td>, overlaying the color swatch.
	 * displays border around a color swatch
	 * overrides border color in dijit.css */
  border: 1px solid #aaaaaa;
  padding: 1px;
  font-size: 0; /* Pdding bug of 3rd row images in Firefox*/
}
.oneui .dijitColorPalette .dijitPaletteCell:hover .dijitPaletteImg {
  border: 1px solid #666666;
  outline: 1px solid #aaaaaa;  
}

.oneui .dijitColorPalette .dijitPaletteCell:active .dijitPaletteImg, 
.oneui .dijitColorPalette .dijitPaletteTable .dijitPaletteCellSelected .dijitPaletteImg {
  border: 2px solid #666666;
  outline: none;  
}

.oneui .dijitColorPalette .dijitPaletteCell:hover .dijitPaletteImg .dijitColorPaletteSwatch {
	width: 12px;
	height: 10px;
}
.oneui .dijitColorPalette .dijitPaletteCell:active .dijitPaletteImg .dijitColorPaletteSwatch, 
.oneui .dijitColorPalette .dijitPaletteTable .dijitPaletteCellSelected .dijitPaletteImg .dijitColorPaletteSwatch {
	width: 12px;
	height: 10px;
}

